

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.prime.com.tr/ui"
	template="/WEB-INF/templates/prime.xhtml">

	<ui:define name="head">
		<style type="text/css">
			.yui-dt {
				margin-top:10px;
			}

			.yui-dt table {
				width:100%;
			}

			.yui-ac {
				width:200px;
				padding-bottom:1em;
			}

			.label {
				width:20%;
				padding:4px;
			}

			.value {
				width:80%;
				padding:4px;
			}

			.grid {
				width:100%;
			}
		</style>
	</ui:define>

	<ui:define name="content">

		<h:form prependId="false">
<!--
			<p:panel header="Search Movies">
				<h:panelGrid columns="3">
					<h:outputText value="Title: " />
					<p:autoComplete value="#{categoryController.title}" completeMethod="#{manageMovies.getMoviesByTitle}"/>
					<p:commandButton value="Search" actionListener="#{manageMovies.search}"/>
				</h:panelGrid>
			</p:panel>
-->
			<p:dataTable id="medias" lazy="true" var="item" value="#{mediaController.items}" rows="10" paginator="true">
				<p:column>
					<f:facet name="header">
						<h:outputText value="ReleaseId" />
					</f:facet>
					<h:outputText value="#{item.releaseId}"></h:outputText>
				</p:column>

				<p:column filterBy="#{item.title}" sortBy="#{item.title}">
					<f:facet name="header">
						<h:outputText value="Title" />
					</f:facet>
					<h:outputText value="#{item.title}"></h:outputText>
				</p:column>

				<p:column>
					<f:facet name="header">
						<h:outputText value="Options" />
					</f:facet>
					<p:commandLink value="View" async="true" update="detailsTable" oncomplete="detailsDialog.show();">
						<h:graphicImage value="img/search.png" style="border:0;"/>
						<f:setPropertyActionListener value="#{item}" target="#{mediaController.media}" />
					</p:commandLink>
				</p:column>

			</p:dataTable>

			Export Data

			<br />

			<h:commandLink>
				<h:graphicImage value="/img/excel.png" style="border:0"/>
				<p:dataExporter type="xls" target="movies" fileName="categories" excludeColumns="3"/>
			</h:commandLink>

			<h:commandLink>
				<h:graphicImage value="/img/pdf.png" style="border:0"/>
				<p:dataExporter type="pdf" target="movies" fileName="categories" excludeColumns="3"/>
			</h:commandLink>
		</h:form>

		<p:dialog header="Media Details" widgetVar="detailsDialog" fixedCenter="true">
			<h:panelGrid id="detailsTable" columns="2" width="450px"  border="1">
				<h:outputLabel for="popup-releaseId" value="ReleaseId" />
				<h:outputText id="popup-releaseId" value="#{mediaController.media.releaseId}" />

				<h:outputLabel for="popup-media-id" value="MediaId" />
				<h:outputText id="popup-media-id" value="#{mediaController.media.id}" />

				<h:outputLabel for="popup-media-title" value="Title" />
				<h:outputText id= "popup-media-title" value="#{mediaController.media.title}" />

				<h:outputLabel for="popup-media-description" value="Description" />
				<h:outputText id= "popup-media-description" value="#{mediaController.media.description}" />

			</h:panelGrid>
		</p:dialog>
	</ui:define>

</ui:composition>